<!DOCTYPE html>
<html lang="zh-cn">
<head>
<include file="BlockBase:header_meta" />
<include file="BlockSeo:user_forget" />
<script>
$(document).ready(function(){
	$(".form-user-forget").on('submit',function(e){
		$.ajax({
			url: $(this).attr('action'),
			type: 'POST',
			dataType: 'json',
			timeout: 3000,
			data: $(this).serialize(),
			beforeSend: function(xhr){
				$('.user-forget-alert').html('Loading...');
			},
			error : function(){
				$('.user-forget-alert').html('请求失败，请刷新网页。');
			},
			success: function(json){
				if(json.status == 200){
					$url = '{:ff_url("user/login","",true)}';
					feifei.alert.success('.user-forget-alert',json.info);
					setTimeout(function(){location.href = $url}, 2000);
				}else{
					feifei.alert.warning('.user-forget-alert',json.info);
				}
			},
			complete: function(xhr){
			}
		});
		return false;
	});
});
</script>
</head>
<body class="bg-light user-forget">
<include file="BlockTheme:header" />
<main class="container">
<div class="row">
<div class="col-md-6 offset-md-3">
<div class="card my-3">
	<div class="card-header text-center text-nowrap h4">
		找回密码
	</div>
	<div class="card-body pb-0">
		<form class="form-user-forget" action="{:ff_url('user/forgetpost')}" method="post" target="_blank">
			<fieldset class="form-group">
				<label for="user_phone">手机号</label>
				<input class="form-control" name="user_phone" id="user_phone" type="text" placeholder="请输入你手机号" required>
			</fieldset>
			<fieldset class="form-group">
				<label for="user_vcode">验证码</label>
				<div class="row">
					<div class="col-md-9">
						<input class="form-control" name="user_vcode" id="user_vcode" type="test" placeholder="请输入验证码" required>
					</div>
					<div class="col-md-3">
						<input type="button" class="btn btn-success" id="sendMsg" value="获取验证码">
					</div>
				</div>
			</fieldset>
			<fieldset class="form-group">
				<label for="user_pwd">新密码</label>
				<input class="form-control" name="user_pwd" id="user_pwd" type="password" placeholder="请输入你的新密码" required>
			</fieldset>
			<fieldset class="form-group">
				<label for="user_pwd_re">确认新密码</label>
				<input class="form-control" name="user_pwd_re" id="user_pwd_re" type="password" placeholder="请输入你的新密码" required>
			</fieldset>
			<div class="form-group text-center mb-3">
				<button class="btn btn-primary" id="user-submit" type="submit">找回密码</button>
			</div>
			<div class="form-group user-forget-alert">
			</div>
		</form>		
	</div> 
	<div class="card-footer text-right">
		<a href="{$root}">返回首页</a>
		<a href="{:ff_url('user/login')}">用户登录</a>
		<a href="{:ff_url('user/register')}">没有帐号注册</a>
	</div>
</div><!--card end -->
</div>
</div>
</main>
<include file="BlockTheme:footer" />
<script src="//cdn.bootcss.com/layer/3.0.1/layer.min.js"></script>
<link href="//cdn.bootcss.com/layer/3.0.1/skin/default/layer.css" rel="stylesheet">
<script>
	var loopint=0;   
  $('#sendMsg').click(function(){
  	if (loopint) { //正在60s内；  
  		return ; 
  	}
     var  $phone = $('#user_phone').val();
     if(!$phone) {
     	layer.msg('请填写手机号');  
     	return ; 
     }
      $.ajax({
          url:'index.php?s=user-sendretrieve.html',
          type:'post',
          data:{
              phone:$phone
          },
          success:function(res){
              res= JSON.parse(res);
	          if(res.data.status) {
	               $('#sendMsg').addClass('disabled');
	               settimes();  
	           }
              console.log(res);
              layer.msg(res.data.msg);
          },
          // fail:function(){
          //     alert('请检测你的网络是否正常');
          // }
      })
  });

 /* $("form").submit(function(e){
      $.ajax({
          type:'post',
          url:"{:ff_url('user/forgetpost')}",
          data:{
              user_phone:$('#user_phone').val(),
              user_vcode:$('#code').val(),
              user_pwd:$('#user_pwd').val(),
              user_pwd_re:$("#user_pwd_re").val()
          },
          success:function(res){
              res = JSON.parse(res);
           if(res.status==200) {
               layer.msg('注册成功');
               window.location.href = "/";
           }  else {
               layer.msg(res.info);
           }
          }
      })
      return false;
  });*/

  /**
  	* 定时器；  
  	*/
  function settimes() {
  	 var time = 60;
  	 if(loopint) {
  	 	return ;   
  	 }
  	  loopint = setInterval(()=>{
  	 	time--; 
  	 	if(time<0){
  	 		 $('#sendMsg').removeClass('disabled');
 			 clearInterval(loopint);  
  	 		 loopint = 0;    
 			 return ;  
  	 	}
  	 	console.log(loopint);  
  	 	 $('#sendMsg').val(time+'s后可获取');  
      },1000); 
  }


</script>
</body>
</html>